let index = {};
//新品首发DOM
index.bornNewGoodsList = (data) => {
    //获取要遍历的数据 新品首发
    data = data.data.newGoodsList;
    let len = data.length,
        str = '';
    $('.new_pro').empty();
    for (let i = 0; i < len; i++) {
        str += `<div class="new_pro_infor">
            <div class="new_pro_img" style="background-image:url(./img/${data[i].img})"></div>
            <p class="pro_intro">${data[i].desc}</p>
            <p class="pro_pric">${data[i].price}</p>
        </div>`
    }
    $('.new_pro').append(str);
};
//福利DOM
index.bornFuliDom = (data) => {
    data = data.data.welFare;
    let len = data.length,
        str = '';
    $('.wel_mid_content').empty();
    for (let i = 0; i < len; i++) {
        str += `<div class="wel_mid">
        <div class="wel_mid_img" style="background-image:url(./img/${data[i].img})"></div>
        <div class="wel_mid_des">
            <div class="infor">${data[i].desc}</div>
            <div class="price">
                <p class="nowp">
                    <span class="xsj">限时价&nbsp;<sub>￥</sub>&nbsp;<b>${data[i].price}</b></span>
                </p>
                <p class="befroeP">${data[i].discPrice}</p>
            </div>
            <div class="limitBuy">立即抢购</div>
        </div>
    </div>`
    }
    $('.wel_mid_content').append(str);
}

//囤货DOM
index.bornStock = (data) => {
    //获取要遍历的数据 新品首发
    data = data.data.stockpile;
    let len = data.length,
        str = '';
    $('.wel_right').empty();
    for (let i = 0; i < len; i++) {
        let strli = "";
        for (let j = 0; j < data[i].ul.length; j++) {
            strli += `<li class="stockli">
                <div class="stockImg" style="background-image:url(./img/${data[i].ul[j].img})"></div>
                <div class="descAndPrice">
                    <p class="sdesc" title=${data[i].ul[j].desc}>${data[i].ul[j].desc}</p>
                    <p class="priceCart"><span class="sprice">${data[i].ul[j].price}</span><span class="carts"></span>
                    </p>
                </div>
            </li>`;
        }
        str += `<div class="stock">
                <div class="head">
                    <p class="manyStock">${data[i].headTxt}</p>
                    <a href="#" class="allStock">全部 &gt; </a>
                </div>
                <ul>${strli}</ul >
            </div > `;
    }
    $('.wel_right').append(str);
};
// 人气热销
index.hotGoods = (data) => {
    data = data.data.hotGoods;
    let len = data.length,
        str = '';
    $('.hot_goods_right').empty();
    for (let i = 0; i < len; i++) {
        str += `<div class="saleBlock"> <div class="saleImg" style="background:url(./img/${data[i].img}) no-repeat 50% ;">
      
        <ul>
            <li class="leftfont">
                <p>11.11</p>
                <p>定金预售</p>
            </li>
            <li class="strip">9.9抵29.9
                仅剩15天</li>
        </ul>
    </div>
    <div class="botFont">
        <p class="discounts">
            <a href="#">${data[i].headTxt}</a>
        </p>
        <p class="name"><a href="#" title=${data[i].desc}>${data[i].desc}</a></p>
        <p class="price">￥${data[i].price}</p>
    </div></div>`
    }
    $('.hot_goods_right').append(str);
}
// 居家生活
index.home8 = (data) => {
    data = data.data.home8;
    let len = data.length,
        str = '';
    $('.home8').empty();
    for (let i = 0; i < len; i++) {
        let breads = "";
        let singBlock = "";
        for (let m = 0; m < data[i].breads.length; m++) {
            if (m < data[i].breads.length - 1) {
                breads += `<li>${data[i].breads[m]}</li>/`
            } else {
                breads += `<li>${data[i].breads[m]}</li>`
            }
        }
        for (let n = 0; n < data[i].categoryList.length; n++) {
            singBlock += `
            <div class="singleZone">
                <div class="bedsImg" style="background:url(./img/${data[i].categoryList[n].img}) no-repeat 50% ;"></div>
                <span class="bedDiscount">${data[i].categoryList[n].redTag}</span>
                <p class="bedDes">${data[i].categoryList[n].desc}</p>
                <p class="bedP"><span class="nwp">￥${data[i].categoryList[n].price1}</span><span class="befP">￥${data[i].categoryList[n].price2}</span> </p>
            </div>`;
        }
        str += ` <div class="home_life">
        <div class="topLife">
            <div class="leftHead">${data[i].headTxt}</div>
            <div class="rightLife">
                <ul class="itemLife">
                    ${breads}
                </ul>
                <a href="#" class="lookMore">查看更多 > </a>
            </div>
        </div>
        <div class="bannerLife" style="background:url(./img/${data[i].img}) no-repeat 50% ;"></div>
        <div class="botLife">
            ${singBlock}
        </div>
    </div>`
    }
    $('.home8').append(str);
}
//axios请求json数据
index.getData = () => {
    axios.get('http://rap2api.taobao.org/app/mock/234772/goodslists/newPro')
        .then(response => {
            console.log(response)
            //调用生成list方法
            index.bornNewGoodsList(response);
            //动态生成福利中间区域dom
            index.bornFuliDom(response);
            //囤货DOM
            index.bornStock(response);
            // 人气热销
            index.hotGoods(response);
            index.home8(response);
        }, response => {
            console.log(response);
        });
}
$(() => {
    $('.footer').load("../utils/html/footer.html")
    index.getData();
})
